<template>
  <header class="clearfix"   style="position:relative" >
    <el-menu :default-active="activeIndex2" class="el-menu-demo" mode="horizontal" @select="handleSelect" background-color="#545c64" text-color="#fff" active-text-color="#ffd04b">
      <div class="logo"><p>{{languageData.header.logoText}}</p></div>
      <!--<el-menu-item index="1" style="float: right">{{languageData.header.logoText}}</el-menu-item>-->
      <el-submenu class="right" style="float: right;margin-right: 40px;" index="2" v-show="this.check != 'login'">
        <template slot="title">{{user.userName}}</template>
        <el-menu-item index="2-3" @click="loginOut" :updateStatusData="updateStatusData" style="min-width: 100px">退出</el-menu-item>
      </el-submenu>
      <!--<el-menu-item class="right" style="float: right" index="3"><a  target="_blank">订单管理</a></el-menu-item>-->
    </el-menu>
  </header>
</template>
<style scoped>
  /*基础 中文样式*/
  .logo{float: left;width:120px;height: 58px;border-bottom: 2px solid #545c64;cursor: pointer}
  .logo p{text-align: center; color:rgb(255, 208, 75);font-weight: bold;line-height: 60px;font-size: 16px}
  /**英文样式覆盖**/
  .English .EnglishLogoText{ font-size: 14px;text-indent: 10px}
  .English  .navBox{ width: auto; margin-left: 30px;}
  .English  .red{ left: 30px;width: 120px}
  .English .transport .red{ left: 30px;width: 98px}
  .English .histroy .red{ left: 158px;width: 80px}
  .English .create .red{ left: 267px;width: 212px}
  .English .chart   .red {left: 20px;display: block}
  .English .Histroy   .red {left: 140px;display: block}
  .English .creatOder   .red {left: 250px;width: 250px;display: block}
  .code {width: 100px; height: 100px;border: 1px solid #e1e1e1;}
  .code img {max-width:100%}

</style>
<script>
  import { mapState, mapActions } from 'vuex'
  import Public from '../../vuex/public.js'
  // import loginImg from '../../../static/img/icon/logo.png'
  // import android from '../../../static/img/android.jpg'
  // import ios from '../../../static/img/ios.jpg'
  export default {
    name: 'my-header',
    created () {
      // 收起侧栏
      this.$store.commit('naveTo', false)
     // 查看本页面路由 绑定对应页面class
      this.check = this.$route.name;
      var usr = sessionStorage.getItem('user');
      if(usr) {
        usr = JSON.parse(usr);
        this.user=usr
        if(usr.type == 0){
         // this.$router.push({ name: 'AdminConfig' })
        }
      }else {
        if(this.check != 'login'){
            // this.$router.push({ name: 'AdminConfig' })
        }
      }
    },
    data () {
      return {
        activeIndex: '1',
        activeIndex2: '1',
        showNav:true,
        user:{userName:''}
      }
    },
    methods: {
      ...mapActions({
        lognOutPost: 'loginOutFn'
      }),
      handleSelect(key, keyPath) {
      },
      goLogin () {
        this.$router.push({ name: 'login' })
      },
      goIndex () {
        this.$router.push({ name: 'map' })
      },
      gotAdd () {
        this.$router.push({ name: 'creatOder' })
      },
      gotChart (id) {
        if (id == 1) {
          this.$router.push({name: 'chart'})
        }
        if (id == 2) {
          this.$router.push({name: 'Histroy'})
        }
      },
      //  语言切换
      languageCheng (parm) {
        this.show = !this.show
        if (parm) {
          Public.publicLo.sessionStorageSav('Language',parm)
          this.$store.commit('updateLanguage', parm)
        }
      },
      //
      goAdmin(){
          var test = window.location.href
          this.$router.push({ name: 'adminDavise' })
          //window.open('/adminDavise','_self')
      },
      // 退出
      loginOut (id) {
        var parm = ''
        this.lognOutPost(parm)
      },
      openSuccess (text) {
        this.$message({
          message: text,
          type: 'success'
        })
      },
      openError (text) {
        this.$message.error(text)
      }
    },
    computed: {
      languageData: function () {
        var parm = this.language;
        if (parm) {
            if (parm.check == 'Chinese') {
              parm = parm.Chinese;
            }
            if(parm.check == 'English') {
              parm = parm.English;
            }
        }
        return parm
      },
     updateStatusData: function () {
       var parm = this.updateStatus;
       if (parm == 'out') {
         // 没记住密码保存空 localStorage
         Public.publicLo.sessionStorageSav('token', '');
         Public.publicLo.sessionStorageSav('user', '');
         // 清空所有数据
         this.$store.commit('loginOut', null);
         this.$router.push({ name: 'login' });
         // this.lognOutPost(this.user)
       }
       if (parm == 'outErorr') {
         Public.publicLo.sessionStorageSav('token', '');
         Public.publicLo.sessionStorageSav('user', '');
         // 清空所有数据
         this.$store.commit('loginOut', null);
         this.$router.push({ name: 'login' })
       }
       return 1
     },
      ...mapState([
        'nav',
        'language',
        'updateStatus'
      ])
    },
    mounted () {

    }
  }
</script>

